<!--  -->
<template>
  <div>
    <el-dialog
      title="中压注册线段编辑"
      :visible.sync="show"
      v-if="show"
      width="70%"
      :close-on-click-modal="false"
      :before-close="handleClose"
      v-dialogDrag
    >
        <el-form ref="editForm" :model="editForm" :rules="editRules" label-width="140px" class="editForm" size="medium">
            <el-row>
                <el-col :span="8">
                    <el-form-item label="线段编码" prop="xdbm">
                        <el-input v-model="editForm.xdbm"></el-input>
                    </el-form-item>
                    <el-form-item label="投运日期" prop="tyrq">                      
                        <el-date-picker v-model="editForm.tyrq" type="date" value-format="yyyy-MM-dd" :picker-options="pickerDate" placeholder="请选择" :clearable="false"></el-date-picker>
                    </el-form-item>
                    <el-form-item label="注册日期" prop="zcrq">
                        <el-date-picker v-model="editForm.zcrq" type="date" value-format="yyyy-MM-dd" :picker-options="pickerDate" placeholder="请选择" :clearable="false"></el-date-picker>
                    </el-form-item>
                    <el-form-item label="电缆长度(km)" prop="dlcd">
                        <el-input v-model="editForm.dlcd"></el-input>
                    </el-form-item>
                    <el-form-item label="架空裸导线(km)" prop="ldxcd">
                        <el-input v-model="editForm.ldxcd"></el-input>
                    </el-form-item>
                    <el-form-item label="架空绝缘线(km)" prop="jyxcd">
                        <el-input v-model="editForm.jyxcd"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="线段名称" prop="xdmc">
                        <el-input v-model="editForm.xdmc"></el-input>
                    </el-form-item>
                     <el-form-item label="开关编号" prop="kgbh">
                        <el-input v-model="editForm.kgbh"></el-input>
                    </el-form-item>
                    <el-form-item label="开关类型" prop="kglxm">                    
                        <el-select v-model="editForm.kglxm" placeholder="请选择" @change="kglxChange">
                            <el-option v-for="item in kglxOptions" :key="item.value" :label="item.text" :value="item.value">
                                <span class="txt">{{ item.text }}</span>
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="出线开关" prop="cxkg">
                        <el-select v-model="editForm.cxkg" placeholder="请选择">
                            <el-option v-for="item in cxkgOptions" :key="item.value" :label="item.text" :value="item.value">
                                <span class="txt">{{ item.text }}</span>
                            </el-option>
                        </el-select>
                    </el-form-item>           
                    <el-form-item label="断路器台数" prop="dlqts">
                        <el-input v-model="editForm.dlqts"></el-input>
                    </el-form-item>
                    <el-form-item label="电容器台数" prop="drqts">
                        <el-input v-model="editForm.drqts"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="电压等级(kV)" prop="dydjm">
                        <el-select v-model="editForm.dydjm" placeholder="请选择" @change="dydjChange">
                            <el-option v-for="item in dydjZyOptions" :key="item.value" :label="item.text" :value="item.value">
                                <span class="txt">{{ item.text }}</span>
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="线段性质" prop="xlxzm">
                        <el-select v-model="editForm.xlxzm" placeholder="请选择" @change="xlxzChange">
                            <el-option v-for="item in xlxzOptions" :key="item.value" :label="item.text" :value="item.value">
                                <span class="txt">{{ item.text }}</span>
                            </el-option>
                        </el-select>
                    </el-form-item> 
                    <el-form-item label="地区特征" prop="dqtzm">
                        <el-select v-model="editForm.dqtzm" placeholder="请选择" @change="dqtzChange" :disabled="editForm.zyhs > 0">
                            <el-option v-for="item in dqtzOptions" :key="item.value" :label="item.text" :value="item.value">
                                <span class="txt">{{ item.text }}</span>
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="规划特征" prop="ghtz">
                        <el-select v-model="editForm.ghtz" placeholder="请选择" :disabled="editForm.zyhs > 0">
                            <el-option v-for="item in ghtzOptions" :key="item.value" :label="item.text" :value="item.value">
                                <span class="txt">{{ item.text }}</span>
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="开关设备台数" prop="kgts">
                        <el-input v-model="editForm.kgts"></el-input>
                    </el-form-item>
                    <el-form-item label="开闭所(室)数" prop="kzss">
                        <el-input v-model="editForm.kzss"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="8">
                    <el-form-item label="线路合计(km)" prop="xlhj">
                        <el-input v-model="xlhj" disabled></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="16">
                    <el-form-item label="备注" prop="comm">
                        <el-input v-model="editForm.comm"></el-input>
                    </el-form-item> 
                </el-col>
            </el-row>
        </el-form>
        <span slot="footer">
            <el-button @click="confirm" type="primary" size="medium">确 定</el-button>
            <el-button @click="handleClose" size="medium">取 消</el-button>
        </span>
    </el-dialog>
  </div>
</template>

<script>
import { editZczyXd, checkZczyXdbm, getZczyXd } from "@/api/sjwh/zczy.js";
import { getUserInfo } from "@/utils/utilInfo.js";
import { getDictCombo } from '@/api/tools/dict.js';
import { checkSpecialKey, compareDate, floatAdd } from '@/utils/validate.js';
export default {
    data() {
        const that = this
        const checkXdbm = (rule, value, callback) => {
          if (value) {
            let reg = /^([\u4e00-\u9fa5]{2})([0-9]{3})([\s\S]{0,7})$/
            if (reg.test(value)) {
                if (checkSpecialKey(value)) {
                    let vo = {
                        dwbm: that.editForm.dwbm,
                        xdbm: that.editForm.xdbm,
                        zcrq: that.editForm.zcrq,
                        oid: that.editForm.id
                    }
                    checkZczyXdbm(vo).then(res => {
                        if (res.code == 0 && res.data) {
                            callback()
                        } else {
                            callback('线段编码重复')
                        }
                    })
                } else {
                    callback('禁止输入`~!#$%^&*等特殊字符')
                }
            } else {
                callback('2汉字+3数字+0~7字符')
            }
          } else {
            callback('请输入线段编码')
          }         
        }
        const checkXdmc = (rule, value, callback) => {
            if (value) {
                if (checkSpecialKey(value)) {
                    let vo = {
                        dwbm: that.editForm.dwbm,
                        xdmc: that.editForm.xdmc,
                        zcrq: that.editForm.zcrq,
                        oid: that.editForm.id
                    }
                    checkZczyXdbm(vo).then(res => {
                        if (res.code == 0 && res.data) {
                            that.xdmcRepeat = false
                        } else {
                            that.xdmcRepeat = true
                        }
                        callback()
                    })
                } else {
                    callback('禁止输入`~!#$%^&*等特殊字符')
                }
            } else {
                callback('请输入线段名称')
            }
        }
        const checkKgbh = (rule, value, callback) => {
            if (value) {
                if (checkSpecialKey(value)) {
                    callback()
                } else {
                    callback('禁止输入`~!#$%^&*等特殊字符')
                }
            } else {
                callback('请输入开关编号')
            }
        }
        const checkFourInteger = (rule, value, callback) => {
            let val = value + ''
            if (val) {
                if (/(^([1-9]{1})([0-9]{0,3})$)|(^0$)/.test(val)) {
                    callback()
                } else {
                    callback('1~4位数字且首位数不为0')
                }
            } else {
                if (rule.field == 'dlqts') {
                    callback('请输入断路器台数')
                }
                if (rule.field == 'drqts') {
                    callback('请输入电容器台数')
                }
                if (rule.field == 'kzss') {
                    callback('请输入开闭所(室)数')
                }
                if (rule.field == 'kgts') {
                    callback('请输入开关设备台数')
                }
            }
        }
        const checkXlcd = (rule, value, callback) => {
            let val = value + ''
            if (val) {
                let reg = /(^([1-9]{1})([0-9]{0,5})$)|(^([1-9]{1})([0-9]{0,5})[\.]{1}([0-9]{1,6})$)|(^0[\.]{1}[0-9]{1,6}$)|(^0$)/
                if (reg.test(val)) {
                    callback()
                } else {
                    callback('精度：整数6位，小数点后6位')
                }
            } else {
                if (rule.field == 'dlcd') {
                    callback('请输入电缆长度')
                }
                if (rule.field == 'ldxcd') {
                    callback('请输入架空裸导线长度')
                }
                if (rule.field == 'jyxcd') {
                    callback('请输入架空绝缘线长度')
                }
            }
        }
        const checkComm = (rule, value, callback) => {
            if (value) {
                if (checkSpecialKey(value)) {
                    callback()
                } else {
                    callback('禁止输入`~!#$%^&*等特殊字符')
                }
            } else {
                callback()
            }
        }
        return {
            show: false,
            editForm: {
                xdbm: '', // 线段编码
                kgbh: '', // 开关编号
                dlcd: '', // 电缆长度
                ldxcd: '', // 架空裸导线(km)
                jyxcd: '', // 架空绝缘线(km)
                xlhj: '', // 线路合计(km)

                xdmc: '', // 线段名称
                kglx: '', // 开关类型
                kglxm: '', // 开关类型码
                cxkg: null, // 出线开关
                xlxz: '', // 线段性质
                xlxzm: '', // 线段性质码
                dlqts: '', // 断路器台数
                drqts: '', // 电容器台数

                dydj: '', // 电压等级
                dydjm: '', // 电压等级码
                dqtz: '', // 地区特征
                dqtzm: '', // 地区特征码
                ghtz: '', // 规划特征   
                tyrq: '', // 投运日期
                zcrq: '', // 注册日期
                kgts: '', // 开关设备台数

                kzss: '',  // 开闭所(室)数
                comm: '', // 备注

                dwbm: '', // 单位编码
                dwmc: '', // 单位名称
                dwxz: '', // 单位性质
                dwxzm: '', // 单位性质码
                czbj: null, // 操作标记
                czy: '', // 操作员
                dw: '', // 分区字段(存局厂编码)
                id: '', // 线段id  
            
                zxrq: null, // 注销日期
                tcrq: null, // 退出日期
                zyyhs: null, // 专用用户数
                zybts: null, // 专用变台数
                zybrl: null, // 专用变容量
                zysbts: null, // 专用设备台数
                zysbrl: null, // 专用设备容量
                zyyhrl: null, // 专用用户总容量
                gyyhs: null, // 公用用户数
                gybts: null, // 公用变台数
                gybrl: null, // 公用变总容量
                sdyrl: null, // 双电源容量
                sdyhs: null, // 双电源户数
                byqts: null, // 变压器总台数
                byqrl: null, // 变压器总容量
                yhzrl: null, // 用户总容量
                zyhs: null, // 总用户数    
            },
            editRules: {
                xdbm: [
                    { required: true, validator: checkXdbm, trigger: 'blur' }
                ],
                xdmc: [
                    { required: true, validator: checkXdmc, trigger: 'blur' }
                ],
                dydjm: [
                    { required: true, message: '请选择电压等级', trigger: 'blur' }
                ],
                dqtzm: [
                    { required: true, message: '请选择地区特征', trigger: 'blur' }
                ],
                ghtz: [
                    { required: true, message: '请选择规划特征', trigger: 'blur' }
                ],
                kgbh: [
                    { required: true, validator: checkKgbh, trigger: 'blur' }
                ],
                kglxm: [
                    { required: true, message: '请选择开关类型', trigger: 'blur' }
                ],
                cxkg: [
                    {required: true, message: '请选择是否出线开关', trigger: 'blur'}
                ],
                tyrq: [
                    { required: true, message: '请选择投运日期', trigger: 'blur' }
                ],
                zcrq: [
                    { required: true, message: '请选择注册日期', trigger: 'blur' }
                ],
                xlxzm: [
                    { required: true, message: '请选择线段性质', trigger: 'blur' }
                ],
                dlcd: [
                    { required: true, validator: checkXlcd, trigger: 'blur' },
                ],
                ldxcd: [
                    { required: true, validator: checkXlcd, trigger: 'blur' }
                ],
                jyxcd: [
                    { required: true, validator: checkXlcd, trigger: 'blur' }
                ],
                dlqts: [
                    { required: true, validator: checkFourInteger, trigger: 'blur' }
                ],
                drqts: [
                    { required: true, validator: checkFourInteger, trigger: 'blur' }
                ],
                kzss: [
                    { required: true, validator: checkFourInteger, trigger: 'blur' }
                ],
                kgts: [
                    { required: true, validator: checkFourInteger, trigger: 'blur' }
                ],
                comm: [
                    { validator: checkComm, trigger: 'blur' }
                ],

            },
            dydjZyDict: 'dict_dydj_zy', // 电压等级字典分类值
            dqtzDict: 'dict_dqtz', // 地区特征字典分类值
            kglxDict: 'dict_kglx', // 开关类型字典分类值
            xlxzDict: 'dict_xlxz', // 线段性质字典分类值
            ghtzDict: 'dict_ghtz', // 规划特征字典分类值
            dydjZyOptions: [], // 电压等级下拉框数据
            dqtzOptions: [], // 地区特征下拉框数据
            kglxOptions: [], // 开关类型下拉框数据
            xlxzOptions: [], // 线段性质下拉框数据
            ghtzOptions: [], // 线段性质下拉框数据
            cxkgOptions: [ // 出线开关下拉框数据
                {
                    value: '0',
                    text: '否'
                },
                {
                    value: '1',
                    text: '是'
                }
            ],
            xdmcRepeat: false, // 线段名称是否重复
            pickerDate: { // 投运日期、注册日期选择不能超过当前日期
                disabledDate: time => {
                    return (
                        time.getTime() > new Date()
                    );
                }
            }
        }
    },

    computed: {
        xlhj() {
            const that = this
            let xlhj = 0
            if (that.editForm.dlcd) {
                xlhj = floatAdd(xlhj, parseFloat(that.editForm.dlcd))
            }
            if (that.editForm.ldxcd) {
                xlhj = floatAdd(xlhj, parseFloat(that.editForm.ldxcd))
            }
            if (that.editForm.jyxcd) {
                xlhj = floatAdd(xlhj, parseFloat(that.editForm.jyxcd))
            }
            return xlhj
        }
    },

    props: {
        propEditData: {
            type: Object,
            default: function() {
                return {};
            }
        }
    },

    watch: {
        propEditData: {
            deep: true,
            handler(newVal, oldVal) {
                if (newVal.show) {
                    const that = this
                    that.show = newVal.show
                    that.editForm.id = newVal.id
                    that.getZczyXd(that.editForm.id)
                }
            }
        }
    },

    mounted() {
        const that = this
        let pam1 = {typeCode: that.dydjZyDict}
        let pam2 = {typeCode: that.dqtzDict}
        let pam3 = {typeCode: that.kglxDict}
        let pam4 = {typeCode: that.xlxzDict}
        let pam5 = {typeCode: that.ghtzDict}
        let res1 = getDictCombo(pam1)
        let res2 = getDictCombo(pam2)
        let res3 = getDictCombo(pam3)
        let res4 = getDictCombo(pam4)
        let res5 = getDictCombo(pam5)
        Promise.all([res1, res2, res3, res4, res5]).then(result => {
            that.dydjZyOptions = result[0].data
            that.dqtzOptions = result[1].data
            that.kglxOptions = result[2].data
            that.xlxzOptions = result[3].data
            that.ghtzOptions = result[4].data
        }).catch(reason => {
            console.log(reason)
        })
    },

    methods: {
        /**关闭弹窗 */
        handleClose() {
            const that = this
            that.show = false;
            that.editForm = {
                xdbm: '',
                kgbh: '',
                dlcd: '',
                ldxcd: '',
                jyxcd: '',
                xlhj: '',
                xdmc: '',
                kglx: '',
                kglxm: '',
                cxkg: null,
                xlxz: '',
                xlxzm: '',
                dlqts: '',
                drqts: '',
                dydj: '',
                dydjm: '',
                dqtz: '',
                dqtzm: '',
                ghtz: '',  
                tyrq: '',
                zcrq: '',
                kgts: '',
                kzss: '',
                comm: '',
                dwbm: '',
                dwmc: '',
                dwxz: '',
                dwxzm: '',
                czbj: null,
                czy: '',
                dw: '',
                id: '',       
                zxrq: '',
                tcrq: '',
                zyyhs: null,
                zybts: null,
                zybrl: null,
                zysbts: null,
                zysbrl: null,
                zyyhrl: null,
                gyyhs: null,
                gybts: null,
                gybrl: null,
                sdyrl: null,
                sdyhs: null,
                byqts: null,
                byqrl: null,
                yhzrl: null,
                zyhs: null 
            }
        },

        getZczyXd(id) {
            const that = this
            getZczyXd(id).then(res => {     
                if (res.code == 0) {
                    that.editForm = {
                        xdbm: res.data.xdbm,
                        kgbh: res.data.kgbh,
                        dlcd: res.data.dlcd,
                        ldxcd: res.data.ldxcd,
                        jyxcd: res.data.jyxcd,
                        xlhj: res.data.xlhj,
                        xdmc: res.data.xdmc,
                        kglx: res.data.kglx,
                        kglxm: res.data.kglxm,
                        cxkg: res.data.cxkg,
                        xlxz: res.data.xlxz,
                        xlxzm: res.data.xlxzm,
                        dlqts: res.data.dlqts,
                        drqts: res.data.drqts,
                        dydj: res.data.dydj,
                        dydjm: res.data.dydjm,
                        dqtz: res.data.dqtz,
                        dqtzm: res.data.dqtzm,
                        ghtz: res.data.ghtz,  
                        tyrq: res.data.tyrq,
                        zcrq: res.data.zcrq,
                        kgts: res.data.kgts,
                        kzss: res.data.kzss,
                        comm: res.data.comm,
                        dwbm: res.data.dwbm,
                        dwmc: res.data.dwmc,
                        dwxz: res.data.dwxz,
                        dwxzm: res.data.dwxzm,
                        czbj: 1,
                        czy: res.data.czy,
                        dw: res.data.dw,
                        id: res.data.id,       
                        zxrq: res.data.zxrq,
                        tcrq: res.data.tcrq,
                        zyyhs: res.data.zyyhs,
                        zybts: res.data.zybts,
                        zybrl: res.data.zybrl,
                        zysbts: res.data.zysbts,
                        zysbrl: res.data.zysbrl,
                        zyyhrl: res.data.zyyhrl,
                        gyyhs: res.data.gyyhs,
                        gybts: res.data.gybts,
                        gybrl: res.data.gybrl,
                        sdyrl: res.data.sdyrl,
                        sdyhs: res.data.sdyhs,
                        byqts: res.data.byqts,
                        byqrl: res.data.byqrl,
                        yhzrl: res.data.yhzrl,
                        zyhs: res.data.zyhs
                    }
                } else {
                    that.$message.error(res.message)
                }
            })
        },

        /**确定 */
        confirm() {
            const that = this
            that.$refs['editForm'].validate(valid => {
                if (valid) {
                    if (compareDate(that.editForm.tyrq, that.editForm.zcrq)) {                  
                        that.$message.warning('注册日期不小于投运日期')
                        return false
                    }
                    if (that.xdmcRepeat) {
                        that.$confirm('线段名称重复, 是否继续?', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(() => {
                            that.xlhjConfirm()
                        }).catch(() => {
                            console.log('已取消')         
                        });
                    } else {
                        that.xlhjConfirm()
                    }             
                }
            })
        },
        xlhjConfirm() {
            const that = this
            that.editForm.xlhj = that.xlhj
            if (that.xlhj == 0) {
                that.$confirm('线路合计长度为0, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    that.editZczyXd()
                }).catch(() => {
                    console.log('已取消')         
                }); 
            } else {
                that.editZczyXd()
            }
        },
        async editZczyXd() {
            const that = this
            let zcZyxdsj = that.editForm
            let yxZytdxdValidXdZcrqVO = {
                dwbm: that.editForm.dwbm,
                xdId: [that.editForm.id],
                zcrq: that.editForm.zcrq
            }
            let zcZyxdsjValidCxkgVO = {
                cxkg: that.editForm.cxkg,
                dwbm: that.editForm.dwbm,
                xdbm: that.editForm.xdbm,
                oid: that.editForm.id
            }
            let zcZyyhsjValidXdZcrqVO = {
                dwbm: that.editForm.dwbm,
                xdId: [that.editForm.id],
                zcrq: that.editForm.zcrq
            }
            let res = await editZczyXd({yxZytdxdValidXdZcrqVO, zcZyxdsj, zcZyxdsjValidCxkgVO, zcZyyhsjValidXdZcrqVO})
            if (res.code == 0 && res.data) {
                that.$message.success('中压注册线段编辑成功')
                that.$emit("updateZczyXdTable", 'updateSelf')
                that.handleClose()
            } else {
                that.$message.error(res.message)
            }
        },

        /* 选择开关类型 */
        kglxChange(val) {
            const that = this
            that.kglxOptions.forEach(item => {
                if (item.value == val) {
                    that.editForm.kglx = item.text
                }
            })
        },
        /* 选择线段性质 */
        xlxzChange(val) {
            const that = this
            that.xlxzOptions.forEach(item => {
                if (item.value == val) {
                    that.editForm.xlxz = item.text
                }
            })
        },
        /* 选择电压等级 */
        dydjChange(val) {
            const that = this
            that.dydjZyOptions.forEach(item => {
                if (item.value == val) {
                    that.editForm.dydj = item.text
                }
            })
        },
        /* 选择地区特征 */
        dqtzChange(val) {
            const that = this
            that.dqtzOptions.forEach(item => {
                if (item.value == val) {
                    that.editForm.dqtz = item.text
                }
            })
        },

        /* 获取当前月的1号 */
        getCurrentMonthOne() {
            let date = new Date()
            let year = date.getFullYear()
            let month = date.getMonth() + 1
            if (month < 10) {
                month = '0' + month
            }
            return year + '-' + month + '-01'
        }
  }
};
</script>
<style lang='scss' scoped>
.editForm /deep/ .el-form-item {
    margin-bottom: 20px;
}
.editForm /deep/ .el-date-editor.el-input {
    width: 100%;
}
.editForm /deep/ .el-select {
    width: 100%;
}
/deep/ .el-tree > .el-tree-node {
  min-width: 100%;
  display: inline-block;
}
/deep/ .el-dialog__footer{
  padding: 5px 10px 5px;
}
/deep/ .el-dialog__header{
  padding: 4px 10px 4px;
  line-height: 30px;
}
/deep/ .el-dialog__headerbtn{
  top: 10px;
}
/deep/ .el-dialog__body {
    padding: 10px 20px 1px;
}
</style>
